<template>
  <div>
    <CommonFilter :filter-config="filterConfig" :value="filterForm" @search-query="query">
      <div style="padding: 10px; display: flex; justify-content: flex-end">
        <el-button type="primary" @click="exportOrders">导出订单</el-button>
      </div>
    </CommonFilter>
    <el-card>
      <CommonList
        :list-config="listConfig"
        :list="list"
        :pagination="pagination"
        @go-detail="detail"
        @go-trace="trace"
        @delete-order="deleteOrder"
      />
    </el-card>
  </div>
</template>
<script>
import CommonFilter from '@/components/Custom/CommonFilter'
import CommonList from '@/components/Custom/CommonList'
import getDoorListParams from './getDoorListParams'
import getFilterParams from './getFilterParams'

import { queryList } from '@/api/orders/doorList'
import { makeUrlWithParams } from '../../../utils/utils'
import { exportDoorOrder } from '@/api/apis'

export default {
  name: 'RoOrDoor',
  components: {
    CommonList,
    CommonFilter
  },
  mixins: [
    getDoorListParams,
    getFilterParams
  ],
  data() {
    return {
      list: [],
      pagination: {
        total: 0,
        pageNum: 1,
        pageSize: 10,
        pageSizes: [10, 20, 50, 100]
      }
    }
  },
  mounted() {
    this.query()
  },
  methods: {
    exportOrders() {
      const url = makeUrlWithParams(exportDoorOrder)
      window.open(url)
    },
    query() { // 查询列表
      console.log(this.filterForm)
      const { pageNum, pageSize } = this.pagination
      const params = { ...this.filterForm, pageNum, pageSize }
      queryList(params).then(res => {
        // const resultData = res.data
        // const { code, message, data } = resultData
        // const { records, total, page, current } = data
        // this.paginationData.total = total
      }).catch(err => {
        console.log(err)
      })
    }
  }
}
</script>
